<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:c="http://java.sun.com/jsp/jstl/core"
      xmlns:p="http://primefaces.org/ui"
      xmlns:stdmnu="http://java.sun.com/jsf/composite/components/menu">
    <h:head />
    <h:body>
	 	<ui:composition>
	 	<div id="content_current">
	 		<h:form prependId="false">
				<p:calendar id="inline" value="#{citaListBean.date}" mode="inline" />
				<p:menubar styleClass="centeredMenuBar">
					<p:menuitem icon="ui-add-image" value="#{scrText['screen.cita.etiqueta.nuevaCita']}" action="#{citaListBean.createAction()}" update=":dialogCita"/>
				</p:menubar>
				<h:panelGroup id="panelListaCita" styleClass="ui-panel-lista-datatable">
					<p:dataTable id="dataTableCita" var="bean" value="#{citaListBean.lista}" rows="10" paginator="true"
	                	paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink}"
	                    paginatorPosition="bottom">
	        			<p:column headerText="#{scrText['screen.cita.etiqueta.paciente']}">
	            			<h:outputText value="#{bean.nombrePaciente}" />
	        			</p:column>
	        			<p:column headerText="#{scrText['screen.cita.etiqueta.hora']}">
	            			<h:outputText value="#{bean.hora}" />
	        			</p:column>
	        			<p:column headerText="#{scrText['screen.cita.etiqueta.anotaciones']}">
	            			<h:outputText value="#{bean.informacionAdicional}" />
	        			</p:column>
	        			<p:column styleClass="ui-panel-lista-options-column">
	        				<stdmnu:tableMenu listBean="#{citaListBean}" bean="#{bean}" dialog="dialogCancel"/>
	        			</p:column>
	    			</p:dataTable>
    			</h:panelGroup>
    		</h:form>	
    		<p:dialog id="dialogCita" header="Cita" widgetVar="dialog" modal="true" showEffect="fade" hideEffect="fade" resizable="true" position="center"
    			visible="#{citaListBean.viewDialog}">
    			 <h:form id="dialogForm">
    				<h:panelGrid columns="1" style="width:auto; margin:auto;">
	    				<h:panelGrid columns="3">
	    				
    						<h:outputText value="Paciente:" />
    						<p:autoComplete id="autoCompletePaciente" forceSelection="true" value="#{citaListBean.prototype.nombrePaciente}" 
    							completeMethod="#{citaListBean.completeText}" required="true">
    						</p:autoComplete>
    						<p:message for="autoCompletePaciente" />
    						
    						<h:outputText value="Fecha:" />
    						<p:calendar id="fecha" value="#{citaListBean.date}" style="height: 100px;" required="true"/>
    						<p:message for="fecha" />
    						
    						<h:outputText value="hora:" />
    						<p:selectOneMenu id="hora" value="#{citaListBean.prototype.hora}" required="true">
    							<f:selectItem itemLabel="" itemValue="00:00" />
            					<f:selectItem itemLabel="08:00 am" itemValue="08:00" />
            					<f:selectItem itemLabel="08:30 am" itemValue="08:30" />
            					<f:selectItem itemLabel="09:00 am" itemValue="09:00" />
            					<f:selectItem itemLabel="09:30 am" itemValue="09:30" />
            					<f:selectItem itemLabel="10:00 am" itemValue="10:00" />
            					<f:selectItem itemLabel="10:30 am" itemValue="10:30" />
            					<f:selectItem itemLabel="11:00 am" itemValue="11:00" />
            					<f:selectItem itemLabel="11:30 am" itemValue="11:30" />
            					<f:selectItem itemLabel="12:00 am" itemValue="12:00" />
            					<f:selectItem itemLabel="14:00 pm" itemValue="14:00" />
            					<f:selectItem itemLabel="14:30 pm" itemValue="14:30" />
            					<f:selectItem itemLabel="15:00 pm" itemValue="15:00" />
            					<f:selectItem itemLabel="15:30 pm" itemValue="15:30" />
            					<f:selectItem itemLabel="16:00 pm" itemValue="16:00" />
            					<f:selectItem itemLabel="16:30 pm" itemValue="16:30" />
        					</p:selectOneMenu>
    						<p:message for="hora" />
    						
    						<h:outputText value="Estado:" />
    						<p:selectOneMenu id="estado" value="#{citaListBean.prototype.estado}" required="true">
								<f:selectItem itemLabel="" itemValue="" />
            					<f:selectItem itemLabel="LUCRIN" itemValue="LUCRIN" />
            					<f:selectItem itemLabel="LUCRIN" itemValue="LUCRIN" />
            					<f:selectItem itemLabel="AUSENTE" itemValue="AUSENTE" />
        					</p:selectOneMenu>
    						<p:message for="estado" />
    						
    						<h:outputText value="Anotaciones:" />
    						<p:inputTextarea id="anotaciones" value="#{citaListBean.prototype.informacionAdicional}" 
    							rows="6" cols="33" required="true">
    						</p:inputTextarea>
    						<p:message for="anotaciones" />
    					</h:panelGrid>
    				</h:panelGrid>
    				<h:panelGroup id="actionViewMode" columns="2" style="display:block; text-align:right;">
                		<h:commandButton value="Agregar" action="#{citaListBean.createActionConfirm()}" styleClass="button" />
                		<h:commandButton value="Cerrar" action="#{citaListBean.closeAction()}" 
                			styleClass="button" immediate="true" update=":dialogCita">
                		</h:commandButton>
            		</h:panelGroup>
           		</h:form>
			</p:dialog>
			<p:dialog id="dialogCancelCita" header="Cita" widgetVar="dialogCancel" modal="true" showEffect="fade" hideEffect="fade" resizable="true" position="center">
				<h:outputText value="La cita ha sido cancelada exitosamente" />
    		</p:dialog>
		</div>
    	</ui:composition>
    </h:body>
</html>